<!DOCTYPE html>
<html >

	<head>
		<meta charset="UTF-8">
		<title>焊客e家-焊客秀首页</title>
		<link rel="stylesheet" href="css/reset.css">
		<link rel="stylesheet" href="css/common.css">
		<link rel="stylesheet" href="css/hkx.css">
	</head>

	<body>
		<div class="header innerHead">
			<div class="top">
				<div class="main ovw">
					<p class="fl login">
						<span>欢迎来到焊客e家，请</span>
						<a href="./login.html">登录</a>
						<i class="line"></i>
						<a href="./register.html">免费注册</a>
					</p>

					<p class="fr help">
						<a href="#">帮助中心</a>
						<i class="line"></i>
						<img src="images/phone_icon.png" alt="">
						<span>400-888-888</span>
					</p>
				</div>
			</div>

			<div class="main nav innerNav">
				<div class="fl logo"><img src="images/hkx_logo.png" alt=""></div>

				<div class="fr search">
					<div class="searchCon" style="margin-right:155px;">
						<input type="text" placeholder="请输入关键字">
						<a class="search_btn" href="#">搜索</a>
					</div>
					<a href="./hk_hkx_publish.html"><p class="btn">发布焊客秀</p></a>
				</div>
			</div>
		</div>
		
		<div class="container">
			<div class="main ovw">
				<!-- 左侧内容 -->
				<div class="fl lf_content">
					<!-- 发布 -->
					<div class="text_box">
						<textarea class="text"  name="" maxlength="200" id="text" cols="30" rows="10" placeholder="焊客秀，展示自己的SHOW，说点什么吧！"></textarea>
						<div class="ovw add_img">
							<div class="fl add_btn">
								<img src="images/hkx_img_icon.png" alt="">
								<span>添加图片</span>
							</div>
							<div class="fr">
								<span>(<i class="text_length">0</i>/200)</span>
								<a href="#">发布</a>
							</div>
						</div>

						<!-- 上传图片 -->
						<div class="img_list">
							<img class="sj" src="images/hkx_img_bg2.png" alt="">
							<div class="title">
								<div class="fr close"><img src="images/hkx_close.png" alt=""></div>
								<p class="">添加图片<span>（最多可上传9张）</span></p>
							</div>
							<ul class="add_img_list">
								<li>
									<img src="images/hkx_addimg.png" alt="">
									<div class="shade">
										<img src="images/delete.png" alt="">
									</div>
								</li>
								<li>
									<img src="images/hkx_addimg.png" alt="">
									<div class="shade">
										<img src="images/delete.png" alt="">
									</div>
								</li>
								<li>
									<img src="images/hkx_addimg.png" alt="">
									<div class="shade">
										<img src="images/delete.png" alt="">
									</div>
								</li>
								<li>
									<img src="images/hkx_addimg.png" alt="">
									<div class="shade">
										<img src="images/delete.png" alt="">
									</div>
								</li>
								<li class="add">
									<input type="file">
								</li>
							</ul>	
						</div>
					</div>

					<!-- 发布列表 -->
					<ul class="issue_list">
						<li>
							<div class="fl img_box">
								<img src="images/user_head_a.png" alt="">
							</div>
							<div class="content">
								<p class="name">孟硕</p>
								<p class="time">2017-08-11  18:24</p>
								<!-- 初始显示两行文字 -->
								<div class="describe">
									<p>这两年每每说起进军东南亚，大家都更多的将目光投到印，泰国这些国家。确实印尼的人口红利及泰国的电商及电子支付发展为其招商引资提供了足够的筹码，然而大家却往往忽视了东南亚其他国家，菲律宾就这两年每每说起进军东南亚，</p>
									<div class="unfold_all"><span>展开全文</span><img src="images/below_arrow1.png" alt=""></div>
								</div>
								<!-- 查看全文显示所有文字 -->
								<div class="all_text">
									<p>这两年每每说起进军东南亚，大家都更多的将目光投到印，泰国这些国家。确实印尼的人口红利及泰国的电商及电子支付发展为其招商引资提供了足够的筹码，然而大家却往往忽视了东南亚其他国家，菲律宾就...这两年每每说起进军东南亚，大家都更多的将目光投到印，泰国这些国家。确实印尼的人口红利及泰国的电商及电子支付发展为其招商引资提供了足够的筹码，然而大家却往往忽视了东南亚其他国家，菲律宾就...显示所有文字所有文字 所有文字所有文字所有文字所有文字所有文字所有文字</p>
									<div class="up_all"><span>收起全文</span><img src="images/below_arrow2.png" alt=""></div>
								</div>

								<ul class="img_list">
									<li><img src="images/hkx_img_a.png" alt=""></li>
									<li><img src="images/hkx_img_b.png" alt=""></li>
									<li><img src="images/hkx_img_a.png" alt=""></li>
									<li><img src="images/hkx_img_c.png" alt=""></li>
									<li><img src="images/hkx_img_d.png" alt=""></li>
								</ul>
								
							</div>
							<ul class="operation">
								<li>
									<div class="box collect">
										<img  src="images/collect.png" alt="">
										<span>收藏</span>
									</div>
								</li>
								<li>
									<div class="box zan">
										<img  src="images/zan.png" alt="">
										<span>23</span>
									</div>
								</li>
								<li>
									<div class="box message_btn">
										<img src="images/message.png" alt="">
										<span>23</span>
									</div>
								</li>
							</ul>
							<div class="comment">
								<div class="hint_box">
									<div class="hint">
										<span>登录后才能评论哦～</span>
										<a class="fr  login_btn" href="">登录</a>
										<a class="fr zc_btn" href="">立即注册</a>
									</div>
								</div>
								<ul class="comment_list">
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
								</ul>
								<div class="all_comment">
									<a href="">
									<span>查看全部评论</span>
									<img src="images/below_arrow.png" alt="">
									</a>
								</div>
							</div>
						</li>
					
						<!--  -->
						<li>
							<div class="fl img_box">
								<img src="images/user_head_a.png" alt="">
							</div>
							<div class="content">
								<p class="name">孟硕</p>
								<p class="time">2017-08-11  18:24</p>
								<div class="describe">
									<p>这两年每每说起进军东南亚，大家都更多的将目光投到印，泰国这些国家。确实印尼的</p>
								</div>
							</div>
							<ul class="operation">
								<li>
									<div class="box collect">
										<img  src="images/collect.png" alt="">
										<span>收藏</span>
									</div>
								</li>
								<li>
									<div class="box zan">
										<img  src="images/zan.png" alt="">
										<span>23</span>
									</div>
								</li>
								<li>
									<div class="box message_btn">
										<img src="images/message.png" alt="">
										<span>23</span>
									</div>
									
								</li>
							</ul>
							<div class="comment">
								<div class="hint_box">
									<div class="hint">
										<span>登录后才能评论哦～</span>
										<a class="fr  login_btn" href="">登录</a>
										<a class="fr zc_btn" href="">立即注册</a>
									</div>
								</div>
								<ul class="comment_list">
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
								</ul>
								<div class="all_comment">
									<a href="">
									<span>查看全部评论</span>
									<img src="images/below_arrow.png" alt="">
									</a>
								</div>
							</div>
						</li>
						<!--  -->
						<li>
							<div class="fl img_box">
								<img src="images/user_head_a.png" alt="">
							</div>
							<div class="content">
								<p class="name">孟硕</p>
								<p class="time">2017-08-11  18:24</p>
								<!-- 初始显示两行文字 -->
								<div class="describe">
									<p>这两年每每说起进军东南亚，大家都更多的将目光投到印，泰国这些国家。确实印尼的人口红利及泰国的电商及电子支付发展为其招商引资提供了足够的筹码，然而大家却往往忽视了东南亚其他国家，菲律宾就这两年每每说起进军东南亚，</p>
									<div class="unfold_all"><span>展开全文</span><img src="images/below_arrow1.png" alt=""></div>
								</div>
								<!-- 查看全文显示所有文字 -->
								<div class="all_text">
									<p>这两年每每说起进军东南亚，大家都更多的将目光投到印，泰国这些国家。确实印尼的人口红利及泰国的电商及电子支付发展为其招商引资提供了足够的筹码，然而大家却往往忽视了东南亚其他国家，菲律宾就...这两年每每说起进军东南亚，大家都更多的将目光投到印，泰国这些国家。确实印尼的人口红利及泰国的电商及电子支付发展为其招商引资提供了足够的筹码，然而大家却往往忽视了东南亚其他国家，菲律宾就...显示所有文字所有文字 所有文字所有文字所有文字所有文字所有文字所有文字</p>
									<div class="up_all"><span>收起全文</span><img src="images/below_arrow2.png" alt=""></div>
								</div>

								<ul class="img_list">
									<li><img src="images/hkx_img_a.png" alt=""></li>
									<li><img src="images/hkx_img_b.png" alt=""></li>
									<li><img src="images/hkx_img_d.png" alt=""></li>
								</ul>
								
							</div>
							<ul class="operation">
								<li>
									<div class="box collect">
										<img  src="images/collect.png" alt="">
										<span>收藏</span>
									</div>
								</li>
								<li>
									<div class="box zan">
										<img  src="images/zan.png" alt="">
										<span>28</span>
									</div>
								</li>
								<li>
									<div class="box message_btn">
										<img src="images/message.png" alt="">
										<span>23</span>
									</div>
								</li>
							</ul>
							<div class="comment">
								<div class="hint_box">
									<div class="hint">
										<span>登录后才能评论哦～</span>
										<a class="fr  login_btn" href="">登录</a>
										<a class="fr zc_btn" href="">立即注册</a>
									</div>
								</div>
								<ul class="comment_list">
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
									<li>
										<div class="fl user_head"><img src="images/user_head_a.png" alt=""></div>
										<div class="comment_content">
											<p class="info">
												<span class="name">张三</span>
												<span class="fr date">发表于  07-01 15:00</span>
											</p>
											<p class="text">这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很好耶意很好耶这个主意很好耶这个主意很好耶这个主意很好耶这个主意很</p>
										</div>
									</li>
								</ul>
								<div class="all_comment">
									<a href="">
									<span>查看全部评论</span>
									<img src="images/below_arrow.png" alt="">
									</a>
								</div>
							</div>
						</li>
					</ul>
					<div class="more">
						<a href="">
							<img src="images/add_icon.png" alt="">
							<span>加载更多</span>
						</a>
					</div>
				</div>
				<!-- 右侧内容 -->
				<div class="fr rt_content">
					<dl class="hot_hk_list">
						<dt>热门焊客秀展区</dt>
						<dd>
							<div class="fl hot_img"><img src="images/hkx_hot.png" alt=""></div>
							<div class="intro">
								<p>曾经我也是一名优秀的焊工希望和大家多交流...我也是一名优秀的</p>
								<div class="user_info">
									<img src="images/hkx_user_head.png" alt="">
									<span>张先生</span>
								</div>
							</div>
						</dd>
						<dd>
							<div class="fl hot_img"><img src="images/hkx_hot.png" alt=""></div>
							<div class="intro">
								<p>曾经我也是一名优秀的焊工希望和大家多交流...我也是一名优秀的</p>
								<div class="user_info">
									<img src="images/hkx_user_head.png" alt="">
									<span>张先生</span>
								</div>
							</div>
						</dd>
						<dd>
							<div class="fl hot_img"><img src="images/hkx_hot.png" alt=""></div>
							<div class="intro">
								<p>曾经我也是一名优秀的焊工希望和大家多交流...我也是一名优秀的</p>
								<div class="user_info">
									<img src="images/hkx_user_head.png" alt="">
									<span>张先生</span>
								</div>
							</div>
						</dd>
						<dd>
							<div class="fl hot_img"><img src="images/hkx_hot.png" alt=""></div>
							<div class="intro">
								<p>曾经我也是一名优秀的焊工希望和大家多交流...我也是一名优秀的</p>
								<div class="user_info">
									<img src="images/hkx_user_head.png" alt="">
									<span>张先生</span>
								</div>
							</div>
						</dd>
						<dd class="bor_none">
							<div class="fl hot_img"><img src="images/hkx_hot.png" alt=""></div>
							<div class="intro">
								<p>曾经我也是一名优秀的焊工希望和大家多交流...我也是一名优秀的</p>
								<div class="user_info">
									<img src="images/hkx_user_head.png" alt="">
									<span>张先生</span>
								</div>
							</div>
						</dd>
					</dl>
					<div class="rt_img"><a href=""><img src="images/hkx_img.png" alt=""></a></div>
				</div>
			</div>
		</div>
		
		
		<!-- 底部 -->
	<div class="footer">
		<div class="main footer_content ovw">
			<div class="fl contact">
				<div class="fl img_box"><img src="images/service.png" alt=""></div>
				<div class="fl text">
					<p class="label">联系我们</p>
					<p class="phone_number">400-8208-820</p>
					<p class="work_time">工作时间（工作日）9:00 - 18:00</p>
				</div>
			</div>
			<dl>
				<dt><a href="">友情链接</a></dt>
				<dd><a href="">阿里巴巴</a></dd>
				<dd><a href="">新浪微博</a></dd>
				<dd><a href="">腾讯微博</a></dd>
				<dd><a href="">百度论坛</a></dd>
			</dl>
			<dl>
				<dt><a href="">服务</a></dt>
				<dd><a href="">智能对接</a></dd>
				<dd><a href="">焊客圈</a></dd>
				<dd><a href="">焊客圈众创</a></dd>
			</dl>
			<dl>
				<dt><a href="">帮助中心</a></dt>
				<dd><a href="">如何发布对接</a></dd>
				<dd><a href="">如何成为供应商</a></dd>
				<dd><a href="">如何成为技术专家</a></dd>
				<dd><a href="">如何发表众创</a></dd>
			</dl>
			<div class="fr download">
				<p class="title">移动端下载</p>
				<div class="fl code_box">
					<img src="images/code_a.png" alt="">
					<p>IOS下载</p>
				</div>
				<div class="fl code_box">
					<img src="images/code_b.png" alt="">
					<p>安卓下载</p>
				</div>
			</div>
		</div>
		<p class="footer_text">Copyright@ 沪ICP备2015234568号 - 2015 沪公安网备案 201520150201502015088888888号</p>
	</div>
	<script src="js/jquery.1.9.1.js"></script>
	<script src="js/common.js"></script>
	<script src="js/jquery.font.js"></script>

	<script>
	// 限制初始字数
		$(".describe p").fonts({
				fontNum: 90,
			});
		$(".intro p").fonts({
				fontNum: 26,
			});
	$(function(){

		// 点击添加图片 , 弹窗显示
		$(".add_btn").click(function(){
			$(".img_list").show();
		});
		// 关闭
		$(".close").click(function(){
			$(this).parents(".img_list").hide();
		})
		$(".add_img_list li").hover(function(){
			$(this).find(".shade").show();
		},function(){
			$(this).find(".shade").hide();
		});

		$(".shade img").click(function(){
			$(this).parents("li").remove();
		});

		// 文本域键盘按下 , 获取字数
		$("#text").keyup(function(){
			var value = $('#text').val().length;
			$(".text_length").text(value);
		});

		// 收藏
		$(".collect").click(function(){
			if($(this).find("span").text() == "收藏" ){
				$(this).find("img").attr("src","images/collect1.png");
				$(this).find("span").text("已收藏");
			}else{
				$(this).find("img").attr("src","images/collect.png");
				$(this).find("span").text("收藏");
			}
		});

		// 点赞
		$(".zan").click(function(){
			if($(this).find("img").attr("src") == "images/zan.png"){
				var num = $(this).find("span").text();
				$(this).find("img").attr("src","images/zan1.png");
				$(this).find("span").text(++num);
			}else{
				var num = $(this).find("span").text();
				$(this).find("span").text(num);
			}
		});

		// 点击评论图标 , 显示评论列表
		$(".message_btn").click(function(){
			$(this).parents(".operation").next().toggle();
		})

		// 点击查看全文
		$(".unfold_all").click(function(){
			$(this).parent().hide();
			$(this).parent().next().show();
		})
		// 收起全文
		$(".up_all").click(function(){
			$(this).parent().hide();
			$(this).parent().prev().show();
		})
	})
	</script>
	</body>

</html>